<!--
 * @Descripttion: 
 * @version: 1.0.0
 * @Author: Wupy
 * @Date: 2023-02-13 12:15:30
 * @LastEditors: Wupy
 * @LastEditTime: 2023-02-21 11:43:29
-->
<template>
    <!-- 导航栏 -->
    <div class="navTitle">
        <div class="leftIcon"><var-icon name="chevron-left" :size="35" color="#000" @click="backRouter()" /></div>
        <div class="header">章节详情</div>
    </div>
    <!-- 视频 -->
    <div class="video" v-html="sectionInfo.content" v-if="sectionInfo">

    </div>
</template>

<script setup>

import { ref,reactive,onMounted } from 'vue'
import { useRouter, useRoute } from 'vue-router';
import {useLessonStore} from '@/stores/lesson'
import {storeToRefs} from 'pinia'
const route = useRoute()
const router = useRouter()

const lessonStore = useLessonStore()
const {getSectionBySectionId} = lessonStore
const {sectionInfo} = storeToRefs(lessonStore)

// 获取课程id
const classId = route.query.id
console.log('chapterItemId', classId);

function backRouter() {
    router.go(-1)
}
onMounted(()=>{
    getSectionBySectionId(classId)
})
</script>

<style lang="less" scoped>
.navTitle {
    line-height: 30px;
    display: flex;

    .leftIcon {
        margin-top: 10px;
    }

    .header {
        margin-left: 130px;
        font-size: 16px;
        margin-top: 10px;
        font-weight: 900;
    }
}
.video{
    width: 380px;
}
</style>